<template>
  <el-container  style="width: 100%">
<!--    <el-scrollbar-->
<!--        wrapClass="scrollbar-wrap"-->
<!--        :style="{height: scrollHeight}"-->
<!--        ref="scrollbarContainer">-->
<!--    </el-scrollbar>-->
    <el-aside style="height: 100% ; width: 12%" >
      <!-- 菜单栏 -->
      <el-menu
          :default-openeds="openeds"
          background-color="#fafafa"
          text-color="#BFCBD9"
          unique-opened
          active-text-color="#3491FF"
          router
          :collapse-transition="false"
      >
        <el-submenu class="submenu" index="1">
          <template #title>
            <i class="el-icon-s-custom"></i>
            <span style="color: #2f2f2f"> 个人问卷 </span>
          </template>
          <el-menu-item ><el-button type="text" @click="changeRefer"><i class="el-icon-menu"></i>我创建的</el-button> </el-menu-item>
          <el-menu-item><el-button type="text" @click="gotoRecycle"><i class="el-icon-menu"></i>回收站</el-button> </el-menu-item>
        </el-submenu>
        <el-submenu class="submenu" index="2">
          <template #title>
            <i class="el-icon-document-add"></i>
            <span style="color: #2f2f2f"> 新建问卷 </span>
          </template>
          <el-menu-item><el-button type="text" @click="newCommon"><i class="el-icon-document"></i>普通问卷</el-button> </el-menu-item>
          <el-menu-item><el-button type="text" @click="newVote"><i class="el-icon-document"></i>投票问卷</el-button> </el-menu-item>
          <el-menu-item><el-button type="text" @click="newApply"><i class="el-icon-document"></i>报名问卷</el-button> </el-menu-item>
          <el-menu-item><el-button type="text" @click="newExam"><i class="el-icon-document"></i>考试问卷</el-button> </el-menu-item>
          <el-menu-item><el-button type="text" @click="newCardin"><i class="el-icon-document"></i>疫情打卡问卷</el-button> </el-menu-item>
        </el-submenu>
      </el-menu>
    </el-aside>
    <el-main class="listBack">
      <el-header>
      <div class="search">
        <el-input  class="input-with-select" type="text" v-model="searchkey" placeholder="搜索"  prefix-icon="el-icon-search" clearable >
        </el-input>
      </div>
      <div class="searchbutton">
        <el-button class="headerButton" type="primary" circle size="medium"><i class="el-icon-search" @click="confirmSearch"></i></el-button>
      </div>
      </el-header>
      <div style="font-size:25px" class="movePage">
        <el-button type="primary" size="mini" style="width: 90px" icon="el-icon-arrow-left" @click="toLastPage" >上一页 </el-button>
        &nbsp;&nbsp;
        <el-input v-model="nowPage" placeholder="请输入页码" style="width: 70px"></el-input>
        <el-button style="width: 70px"  type="primary" @click="showMeCreate">显示</el-button>
        <span style="font-size: 20px">      共{{getTotalPage()}}页</span>
        &nbsp;&nbsp;
        <el-button  type="primary" size="mini" style="width: 90px" @click="toNextPage">下一页<i class="el-icon-arrow-right el-icon--right"></i></el-button>
      </div>
      <el-table class="list_table" header-row-style="font-size:20px" @sort-change="changeSort" style="width: 100% "  height="60%" :data="questionnaires"  :header-cell-style="{'text-align':'center'}">
        <el-table-column  prop="id" width="1px" v-if="false">
        </el-table-column>
        <el-table-column  prop="status" width="1px" v-if="false">
        </el-table-column>
        <el-table-column  prop="name" label="问卷名" min-width="80px" align="center">
        </el-table-column>
        <el-table-column  prop="type" label="问卷类型" min-width="80px" align="center">
        </el-table-column>
        <el-table-column sortable="custom" prop="created_time" label="创建时间" min-width="80px" align="center">
        </el-table-column>
        <el-table-column sortable="custom" prop="publish_time" label="发布时间" min-width="80px" align="center">
        </el-table-column>
        <el-table-column sortable="custom" prop="quantity" label="回收量"  min-width="80px" align="center">
        </el-table-column>
        <el-table-column prop="operation" label="执行操作" min-width="240px" align="center">
          <template v-slot="scope">
            <el-button @click="edit(scope.row)" type="text" class="el-icon-edit" style="font-size: 17px; ">详情</el-button>
            <el-button @click="copy(scope.row)" type="text" size="small" class="el-icon-document-copy" style="font-size: 17px ;margin-left:20px">复制</el-button>
            <el-button v-if="scope.row.status===0" @click="changePublish(scope.row)" type="text" size="small" class="el-icon-video-play" style="font-size: 17px ;margin-left:20px">发布</el-button>
            <el-button v-else @click="changePublish(scope.row)" type="text" size="small" class="el-icon-video-pause" style="font-size: 17px ;margin-left:20px">停止</el-button>
            <el-button @click="share(scope.row)" type="text" size="small" class="el-icon-share" style="font-size: 17px ;margin-left:20px">分享</el-button>
            <el-button @click="output(scope.row)" type="text" size="small" class="el-icon-download" style="font-size: 17px ;margin-left:20px">导出</el-button>
            <el-button @click="moveToRecycle(scope.row)" type="text" size="small" class="el-icon-delete" style="font-size: 17px ;margin-left:20px">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-main>
  </el-container>
  <el-dialog
      top="15%"
      class="share"
      title=""
      v-model="dialogVisible"
      width="40%">
    <div class="in-el-dialog">
      <div class="imgOutside"> <img style="height: 120px" :src="imgUrl" />  </div>
      <div class="input"><el-input v-model="inputUrl"> </el-input></div>
      <div class="download"><el-button @click="downloadUrl">下载二维码</el-button></div>
      <div class="open"><el-button  @click="openUrl">打开链接</el-button></div>
    </div>
<!--      <template #footer>-->
<!--    <span class="dialog-footer">-->
<!--      <el-button @click="dialogVisible = false">取 消</el-button>-->
<!--      <el-button type="primary" @click="dialogVisible = false">确 定</el-button>-->
<!--    </span>-->
<!--      </template>-->
  </el-dialog>
</template>
<script>
import axios from "axios";
export default  {
  name: "Home",
  data() {
    return {
      // scrollHeight:'0px',
      imgUrl: '',
      inputUrl: '',
      openeds: ['1', '2'],
      uniqueOpened: false,
      dialogVisible: false,
      referToFile: '',
      searchkey: '',
      savedSearchkey: '',
      columnName: '',
      increaseOrder: '',
      form1: {
        username:'',
        page: '',
        reverse: '',
        sorted_by: '',
      },
      form2: {
        qid: '',
        is_delete: '',
      },
      form3: {
        username: '',
        page: '',
        title: '',
        sorted_by: '',
        reverse: '',
      },
      form_copy: {
        qid: '',
      },
      form_check: {
        questionnaire_id: '',
      },
      form_newQuestionnaire: {
        username: '',
        type: '',
      },
      form_share: {
        questionnaire_id: '',
      },
      form_output:{
        questionnaire_id: '',
        form:'',
      },
      form_publish:{
        questionnaire_id:'',
      },
      questionnaires: [{
        id: '',
        status:'',
        name: '',
        type: '',
        quantity: '',
        created_time: '',
        publish_time: '',
      }],
      username: localStorage.getItem('username'),
      nowPage:'',
      totalPage:'',
      isPublished:'',
    }
  },
  mounted() {
    this.changeRefer()
    // this.scrollHeight = window.innerHeight*0.7 + 'px';
  },
  methods: {
    changePublish:function (row) {
      this.form_publish.questionnaire_id=row.id
      axios.post("change_status/", this.form_publish).then(() => {
        if(this.referToFile===true){
          this.form1.username=this.username
          this.form1.page=this.nowPage
          this.form1.reverse=this.increaseOrder
          this.form1.sorted_by=this.columnName
          const that=this
          this.$options.methods.postQuestionSort(this.form1,that)
          this.referToFile=true
        }
        //点击搜索了之后，改变显示的内容。
        else{
          this.form3.username=this.username
          this.form3.page=this.nowPage
          this.form3.title=this.savedSearchkey
          this.form3.sorted_by=this.columnName
          this.form3.reverse=this.increaseOrder
          const that=this
          this.$options.methods.postSearchSort(this.form3,that)
          this.referToFile=false
        }
      });
    },
    output:function (row){
      this.form_output.questionnaire_id=row.id
      this.form_output.form='docx'
      axios.post('export_questionnaire/',this.form_output).then((response) =>{
        window.open(response.data.url, '_blank')
      })
    },
    share:function (row){
      this.dialogVisible=true
      this.form_share.questionnaire_id = row.id
      axios.post('qrcode/',this.form_share).then((response) => {
        console.log(response.data.url)
        this.imgUrl=response.data.url
      })
      axios.post('code/',this.form_share).then((response) => {
        console.log(response)
        this.inputUrl='http://8.140.186.185:8008/deliver/'+response.data.questionnaire_id
      })
    },
    downloadUrl:function (){
      console.log(this.imgUrl)
      window.open(this.imgUrl, '_blank')
    },
    openUrl:function (){
      console.log(this.inputUrl)
      window.open(this.inputUrl, '_blank')
    },
    newCommon:function (){
      this.form_newQuestionnaire.username=this.username
      this.form_newQuestionnaire.type='default'
      axios.post("createquestionnaire/",this.form_newQuestionnaire).then((response) => {
        console.log(response.data.questionnaire_id)
        this.$router.push('/questionnaire/'+response.data.questionnaire_id);
      });
    },
    newVote:function (){
      this.form_newQuestionnaire.username=this.username
      this.form_newQuestionnaire.type='vote'
      axios.post("createquestionnaire/",this.form_newQuestionnaire).then((response) => {
        console.log(response)
        this.$router.push('/questionnaire/'+response.data.questionnaire_id)
      });
    },
    newApply:function (){
      this.form_newQuestionnaire.username=this.username
      this.form_newQuestionnaire.type='apply'
      axios.post("createquestionnaire/",this.form_newQuestionnaire).then((response) => {
        console.log(response)
       this.$router.push('/questionnaire/'+response.data.questionnaire_id)
      });
    },
    newExam:function (){
      this.form_newQuestionnaire.username=this.username
      this.form_newQuestionnaire.type='exam'
      axios.post("createquestionnaire/",this.form_newQuestionnaire).then((response) => {
        console.log(response)
        this.$router.push('/questionnaire/'+response.data.questionnaire_id)
      });
    },
    newCardin:function (){
      this.form_newQuestionnaire.username=this.username
      this.form_newQuestionnaire.type='cardin'
      axios.post("createquestionnaire/",this.form_newQuestionnaire).then((response) => {
        console.log(response)
        this.$router.push('/questionnaire/'+response.data.questionnaire_id)
      });
    },
    gotoRecycle:function (){
      this.$router.push('/recycle')
    },
    changeRefer:function (){
      this.referToFile=true
      this.columnName='created_time'
      this.increaseOrder=true
      this.form1.username=this.username
      this.form1.page='1'
      this.form1.reverse=this.increaseOrder
      this.form1.sorted_by=this.columnName
      this.nowPage=this.form1.page
      const that=this
      this.$options.methods.postQuestionSort(this.form1,that)
    },
    showMeCreate: function () {
      if(this.referToFile===true){
        this.form1.username=this.username
        this.form1.page=this.nowPage
        this.form1.reverse=this.increaseOrder
        this.form1.sorted_by=this.columnName
        const that=this
        this.$options.methods.postQuestionSort(this.form1,that)
        this.referToFile=true
      }
      //点击搜索了之后，改变显示的内容。
      else{
        this.form3.username=this.username
        this.form3.page=this.nowPage
        this.form3.title=this.savedSearchkey
        this.form3.sorted_by=this.columnName
        this.form3.reverse=this.increaseOrder
        const that=this
        this.$options.methods.postSearchSort(this.form3,that)
        this.referToFile=false
      }
    },
    moveToRecycle:async function (row) {
      this.form2.qid=row.id
      this.form2.is_delete= 'True'
      await axios.post("delete/", this.form2).then(() => {
      });
      if(this.referToFile===true){
        this.form1.username=this.username
        this.form1.page=this.nowPage
        this.form1.reverse=this.increaseOrder
        this.form1.sorted_by=this.columnName
        const that=this
        this.$options.methods.postQuestionSort(this.form1,that)
        this.$alert('删除成功')
      }
      else{
        this.form3.username=this.username
        this.form3.page=this.nowPage
        this.form3.title=this.savedSearchkey
        this.form3.sorted_by=this.columnName
        this.form3.reverse=this.increaseOrder
        const that=this
        this.$options.methods.postSearchSort(this.form3,that)
        this.$alert('删除成功')
      }

    },
    getTotalPage:function (){
      if(this.referToFile===true){
        this.form1.username=this.username
        this.form1.page='1'
        this.form1.reverse=true
        this.form1.sorted_by='publish_time'
        axios.post("questionnaire_sort/", this.form1).then((response) => {
          this.totalPage=response.data.total_page
        });
        return this.totalPage
      }
      else{
        this.form3.username=this.username
        this.form3.page='1'
        this.form3.title=this.savedSearchkey
        this.form3.sorted_by='publish_time'
        this.form3.reverse=true
        axios.post("questionnaire_search/", this.form3).then((response) => {
          this.totalPage=response.data.total_page
        });
        return this.totalPage
      }
    },
    edit:function (row) {
      this.form_check.questionnaire_id = row.id
      axios.post('code/',this.form_check).then((response) => {
        this.$router.push('/questionnaire/'+response.data.questionnaire_id)
      })
    },
    confirmSearch:function (){
      this.referToFile=false
      this.savedSearchkey=this.searchkey
      this.form3.username=this.username
      this.form3.page='1'
      this.nowPage=this.form3.page
      this.form3.title=this.savedSearchkey
      this.form3.sorted_by=this.columnName
      this.form3.reverse=this.increaseOrder
      if(this.searchkey===''){
        this.$alert("请输入关键词")
        return
      }
      const that=this
      this.$options.methods.postSearchSort(this.form3,that)
    },
    returnRightTime:function (str){
      let result=''
      let y_m_d = str.slice(0,10)
      let hour = parseInt(str.slice(11,13))
      let m_and_s = str.slice(13,19)
      hour=hour+8
      if(hour>=24){
        hour=hour-24
        let day=parseInt(str.slice(8,10))+1
        if(day>=32){
          day=day-31
          if(hour.toString().length===1){
            result='2021-09-0'+day.toString()+' '+'0'+hour.toString()+m_and_s
          }
          else{
            result='2021-09-0'+day.toString()+' '+hour.toString()+m_and_s
          }
        }
        else{
          if(hour.toString().length===1 && day.toString().length===1){
            result='2021-08-0'+day.toString()+' '+'0'+hour.toString()+m_and_s
          }
          if(hour.toString().length===1 && day.toString().length!==1){
            result='2021-08-'+day.toString()+' '+'0'+hour.toString()+m_and_s
          }
          if(hour.toString().length!==1 && day.toString().length===1){
            result='2021-08-0'+day.toString()+' '+hour.toString()+m_and_s
          }
          if(hour.toString().length!==1 && day.toString().length!==1){
            result='2021-08-'+day.toString()+' '+hour.toString()+m_and_s
          }
        }
      }
      else{
        if(hour.toString().length===1){
          result = y_m_d+' '+'0'+hour.toString()+m_and_s
        }
        else{
          result = y_m_d+' '+hour.toString()+m_and_s
        }
      }
      return result
    },
    changeSort:function (val) {
      //对所有问卷排序
      if(this.referToFile===true) {
        if (val.prop === 'publish_time') {
          if(val.order==='ascending'){
            this.columnName = 'publish_time'
            this.increaseOrder = true
            this.form1.username = this.username
            this.form1.page = this.nowPage
            this.form1.reverse = this.increaseOrder
            this.form1.sorted_by = this.columnName
            const that=this
            this.$options.methods.postQuestionSort(this.form1,that)
          }
          if(val.order==='descending'){
            this.columnName = 'publish_time'
            this.increaseOrder = false
            this.form1.username = this.username
            this.form1.page = this.nowPage
            this.form1.reverse = this.increaseOrder
            this.form1.sorted_by = this.columnName
            const that=this
            this.$options.methods.postQuestionSort(this.form1,that)
          }
        }
        if (val.prop === 'created_time') {
          if(val.order==='ascending'){
            this.columnName = 'created_time'
            this.increaseOrder = true
            this.form1.username = this.username
            this.form1.page = this.nowPage
            this.form1.reverse = this.increaseOrder
            this.form1.sorted_by = this.columnName
            const that=this
            this.$options.methods.postQuestionSort(this.form1,that)
          }
          if(val.order==='descending'){
            this.columnName = 'created_time'
            this.increaseOrder = false
            this.form1.username = this.username
            this.form1.page = this.nowPage
            this.form1.reverse = this.increaseOrder
            this.form1.sorted_by = this.columnName
            const that=this
            this.$options.methods.postQuestionSort(this.form1,that)
          }
        }
        if (val.prop === 'quantity') {
          console.log("我是数量")
          if(val.order==='ascending'){
            this.columnName = 'quantity'
            this.increaseOrder = true
            this.form1.username = this.username
            this.form1.page = this.nowPage
            this.form1.reverse = this.increaseOrder
            this.form1.sorted_by = this.columnName
            const that=this
            this.$options.methods.postQuestionSort(this.form1,that)
          }
          if(val.order==='descending'){
            this.columnName = 'quantity'
            this.increaseOrder = false
            this.form1.username = this.username
            this.form1.page = this.nowPage
            this.form1.reverse = this.increaseOrder
            this.form1.sorted_by = this.columnName
            const that=this
            this.$options.methods.postQuestionSort(this.form1,that)
          }
        }
      }
      //对搜索结果进行排序
      else{
        if (val.prop === 'publish_time') {
          if(val.order==='ascending'){
            this.columnName = 'publish_time'
            this.increaseOrder = true
            this.form3.username = this.username
            this.form3.page = this.nowPage
            this.form3.title = this.savedSearchkey
            this.form3.reverse = this.increaseOrder
            this.form3.sorted_by = this.columnName
            const that=this
            this.$options.methods.postSearchSort(this.form3,that)
          }
          if(val.order==='descending'){
            this.columnName = 'publish_time'
            this.increaseOrder = false
            this.form3.username = this.username
            this.form3.page = this.nowPage
            this.form3.title = this.savedSearchkey
            this.form3.reverse = this.increaseOrder
            this.form3.sorted_by = this.columnName
            const that=this
            this.$options.methods.postSearchSort(this.form3,that)
          }
        }
        if (val.prop === 'created_time') {
          if(val.order==='ascending'){
            this.columnName = 'created_time'
            this.increaseOrder = true
            this.form3.username = this.username
            this.form3.page = this.nowPage
            this.form3.title = this.savedSearchkey
            this.form3.reverse = this.increaseOrder
            this.form3.sorted_by = this.columnName
            const that=this
            this.$options.methods.postSearchSort(this.form3,that)
          }
          if(val.order==='descending'){
            this.columnName = 'created_time'
            this.increaseOrder = false
            this.form3.username = this.username
            this.form3.page = this.nowPage
            this.form3.title = this.savedSearchkey
            this.form3.reverse = this.increaseOrder
            this.form3.sorted_by = this.columnName
            const that=this
            this.$options.methods.postSearchSort(this.form3,that)
          }
        }
        if (val.prop === 'quantity') {
          if(val.order==='ascending'){
            this.columnName = 'quantity'
            this.increaseOrder = true
            this.form3.username = this.username
            this.form3.page = this.nowPage
            this.form3.title = this.savedSearchkey
            this.form3.reverse = this.increaseOrder
            this.form3.sorted_by = this.columnName
            const that=this
            this.$options.methods.postSearchSort(this.form3,that)
          }
          if(val.order==='descending'){
            this.columnName = 'quantity'
            this.increaseOrder = false
            this.form3.username = this.username
            this.form3.page = this.nowPage
            this.form3.title = this.savedSearchkey
            this.form3.reverse = this.increaseOrder
            this.form3.sorted_by = this.columnName
            const that=this
            this.$options.methods.postSearchSort(this.form3,that)
          }
        }
      }
    },
    postQuestionSort:function (form,that){
      axios.post("questionnaire_sort/", form).then((response) => {
        that.questionnaires = []
        console.log(response)
        for (var i = 0; i < response.data.questionnaires.length; i++) {
          let str1 = response.data.questionnaires[i].publish_time
          let str2 = response.data.questionnaires[i].created_time
          let str3 = response.data.questionnaires[i].type
          if(str1 === null){
            str1 = '未发布'
          }
          else{
            str1 = that.$options.methods.returnRightTime(str1)
          }
          str2 = that.$options.methods.returnRightTime(str2)
          if(str3==='default'){
            str3 = '普通问卷'
          } else if(str3==='vote'){
            str3 = '投票问卷'
          } else if(str3==='apply'){
            str3 = '报名问卷'
          } else if(str3==='exam') {
            str3 = '考试问卷'
          } else if(str3==='cardin'){
            str3='疫情打卡问卷'
          }
          that.questionnaires.push({
            id:response.data.questionnaires[i].id,
            name: response.data.questionnaires[i].name,
            type:str3,
            status:response.data.questionnaires[i].status,
            quantity: response.data.questionnaires[i].quantity,
            created_time: str2,
            publish_time: str1
          })
        }
      });
    },
    postSearchSort:function (form,that){
      axios.post("questionnaire_search/", form).then((response) => {
        console.log(response)
        that.questionnaires = []
        for (var i = 0; i < response.data.questionnaires.length; i++) {
          let str1 = response.data.questionnaires[i].publish_time
          let str2 = response.data.questionnaires[i].created_time
          let str3 = response.data.questionnaires[i].type
          if(str1===null){
            str1 = '未发布'
          }
          else{
            str1 = that.$options.methods.returnRightTime(str1)
          }
          str2 = that.$options.methods.returnRightTime(str2)
          if(str3==='default'){
            str3 = '普通问卷'
          } else if(str3==='vote'){
            str3 = '投票问卷'
          } else if(str3==='apply'){
            str3 = '报名问卷'
          } else if(str3==='exam'){
            str3 = '考试问卷'
          }else if(str3==='cardin'){
            str3='疫情打卡问卷'
          }
          that.questionnaires.push({
            id: response.data.questionnaires[i].id,
            name: response.data.questionnaires[i].name,
            type :str3,
            status:response.data.questionnaires[i].status,
            quantity: response.data.questionnaires[i].quantity,
            created_time:str2,
            publish_time: str1
          })
        }
      });
    },
    copy:async function (row){
      this.form_copy.qid=row.id
      await axios.post('questionnaire_copy/',this.form_copy).then(() => {
      })
      if(this.referToFile===true){
        this.form1.username=this.username
        this.form1.page=this.nowPage
        this.form1.reverse=this.increaseOrder
        this.form1.sorted_by=this.columnName
        const that=this
        this.$options.methods.postQuestionSort(this.form1,that)
        this.$alert('复制成功')
      }
      else{
        this.form3.username=this.username
        this.form3.page=this.nowPage
        this.form3.title=this.savedSearchkey
        this.form3.sorted_by=this.columnName
        this.form3.reverse=this.increaseOrder
        const that=this
        this.$options.methods.postSearchSort(this.form3,that)
        this.$alert('复制成功')
      }
    },
    toNextPage:function (){
      if(this.totalPage===0){
        this.$alert('当前没有内容')
        return
      }
      this.nowPage++
      if(this.nowPage>this.totalPage){
        this.nowPage--
        this.$alert('已经是最后一页啦')
        return;
      }
      if(this.referToFile===true){
        this.form1.username=this.username
        this.form1.page=this.nowPage
        this.form1.reverse=this.increaseOrder
        this.form1.sorted_by=this.columnName
        const that=this
        this.$options.methods.postQuestionSort(this.form1,that)
        this.referToFile=true
      }
      //点击搜索了之后，改变显示的内容。
      else{
        this.form3.username=this.username
        this.form3.page=this.nowPage
        this.form3.title=this.savedSearchkey
        this.form3.sorted_by=this.columnName
        this.form3.reverse=this.increaseOrder
        const that=this
        this.$options.methods.postSearchSort(this.form3,that)
        this.referToFile=false
      }
    },
    toLastPage:function (){
      if(this.totalPage===0){
        this.$alert('当前没有内容')
        return
      }
      this.nowPage--
      if(this.nowPage<=0){
        this.nowPage++
        this.$alert('已经是第一页啦')
        return;
      }
      if(this.referToFile===true){
        this.form1.username=this.username
        this.form1.page=this.nowPage
        this.form1.reverse=this.increaseOrder
        this.form1.sorted_by=this.columnName
        const that=this
        this.$options.methods.postQuestionSort(this.form1,that)
        this.referToFile=true
      }
      //点击搜索了之后，改变显示的内容。
      else{
        this.form3.username=this.username
        this.form3.page=this.nowPage
        this.form3.title=this.savedSearchkey
        this.form3.sorted_by=this.columnName
        this.form3.reverse=this.increaseOrder
        const that=this
        this.$options.methods.postSearchSort(this.form3,that)
        this.referToFile=false
      }
    }
    // handleClose(done) {
    //   this.$confirm('确认关闭？')
    //       .then(_ => {
    //         done();
    //       })
    //       .catch(_ => {});
    // }

  },
}
</script>
<style scoped>
.el-header {
  background-color: rgba(0, 0, 0, 0);
  display: flex;
  padding-left: 0;
  align-items: center;
  height: 80px;
  align-content: center;
  justify-content: space-between;
}
.el-container {
  height: 100%;
  position: fixed;
  font-family: "微软雅黑";
  /* box-shadow: 1px 0px 20px 1px ; */

}
.el-menu {
  /*background-color: darkblue;*/
  /*text-color:#BFCBD9;*/
  border-right-width: 0px;
  height: 100%;
}
.listBack{
  width: 88%;
  background-color: #f0f0f0;
  height: 100%;
}
.search{
  line-height: 70px;
  width: 25%;
  float: right;
  position: absolute;
  left: 40%;
}
.searchbutton{
  line-height: 70px;
  position: absolute;
  float: right;
  left:66%
}
.movePage{
  line-height: 70px;
  top: 73%;
  position: absolute;
  transform: translate(-50%,0%);
  left: 55%;
}
.in-el-dialog{
  height: 150px;
}
.download {
  position: absolute;
  top: 130px;
  height: 45px;
  left: 200px;
  width: 120px;
}
.open {
  position: absolute;
  top: 130px;
  left: 400px;
  height: 45px;
  width: 120px;
}
.imgOutside {
  position: absolute;
  width: 120px;
  height: 120px;
  border: 1px solid #e1e7f2;
  border-radius: 3px;
  top:50px;
}
.list_table{
  left: 50%;
  transform: translate(-50%,0%);
}
.input {
  position: absolute;
  height: 55px;
  width: 400px;
  left: 160px;
  top: 70px;
}
/*.el-scrollbar {*/
/*  height: 90%;*/
/*}*/
/*.el-scrollbar .scrollbar-wrap{*/
/*  overflow-x: hidden;*/
/*}*/
/*.el-scrollbar .el-scrollbar__bar{*/
/*}*/
.hello > .el-button {
  
}
</style>